<template>

  <div class="bodyParent ">
    <div class="content-body">
      <span class="font18" style="line-height: 1">配置账户</span>
      <hr style="border: 1px solid #E9E9E9;background-color:#E9E9E9 ">
      <el-col class="table-conter">
        <el-row>
          <span style="font-weight: bold;" class="font24">新建</span>
          <el-col class="mt20  mb32">
            <el-col :span="15">
              <el-select v-model="type" placeholder="类型" class="select-type">
                <el-option
                  v-for="item in options1"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
                </el-option>
              </el-select>
              <el-select v-model="name" placeholder="创建人" class="select-type ml200">
                <el-option
                  v-for="item in options2"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value">
                </el-option>
              </el-select>
            </el-col>
            <el-form>
              <el-form-item label="时间：">
                <el-col style=" border-radius: 5px;border: #E8E9EC solid 1px" :span="7">
                  <el-date-picker
                    v-model="value"
                    type="date"
                    :clearable="false"
                    class="data-picker"
                    placeholder="选择日期">
                  </el-date-picker>
                  <svg-icon icon-class="calendar"
                            style="padding: 0 ;color: red;text-align: right"/>
                </el-col>
              </el-form-item>
            </el-form>
          </el-col>
        </el-row>


        <Editor value="123456"></Editor>

        <el-row>
          <el-col class="mt20">
            <el-button

              class="btn-cancel_ok  "
              style="color: #fff;float: right;background-color: #2C95FF"
            >确定
            </el-button>
            <el-button
              class="btn-cancel_ok  mr30 "
              style="color: #2C95FF;float: right; border: 2px solid #2C95FF"
            >取消
            </el-button>

          </el-col>
        </el-row>
      </el-col>

    </div>

  </div>

</template>

<script>
  import Editor from '../../../../../components/Editor'

  export default {
    name: "newaccount",
    components: {
      Editor
    },
    methods: {
      tableRowClassName({row, rowIndex}) {
        if (rowIndex === 1) {
          return 'warning-row';
        } else if (rowIndex === 3) {
          return 'success-row';
        }
        return '';
      }
      ,

    }
    ,
    data() {
      return {
        totle: 7,
        Page: 1,
        type: '',
        name: "",
        value: "",
        options1: [{
          value: '1',
          label: '风险提示'
        }, {
          value: '选项2',
          label: '领队声明'
        }, {
          value: '选项3',
          label: '参赛者须知'
        }],
        options2: [{
          value: '1',
          label: '王晓明'
        }, {
          value: '2',
          label: '王晓明'
        }, {
          value: '3',
          label: '王晓明'
        }],
        value: '1'

      }
    }
  }
</script>

<style>

  .data-picker .el-icon-date:before {
    visibility: hidden;
  }

  #tablescontent .el-select .el-input .el-select__caret {
    color: #0C66FF !important;
  }

  #tablescontent .el-icon-arrow-up:before {
    color: #0C66FF;
  }

  #tablescontent .el-button {
    font-size: 16px;
  }

  .bodyParent .table-conter .el-input--medium .el-input__inner {

    border: hidden;
  }
</style>

<style scoped>
  .mr30 {
    margin-right: 30px;
  }

  .btn-cancel_ok {
    width: 123px;
    height: 35px;
  }

  .ml200 {
    margin-left: 100px;
  }

  .select-type {
    width: 164px
  }

  .table-conter {
    width: 845px;
  }

  .bodyParent {
    padding-left: 20px;
    width: 100%;
    height: 100%;

  }


  .content-body {
    padding: 26px 32px;
    border-radius: 10px;
    width: 100%;
    height: 100%;
    background-color: #fff;
  }

  .content-body hr {
    margin-top: 22px;
    margin-bottom: 26px;

  }


</style>
